<template>
  <div>
    <!-- 2. 在使用组件时，组件标签内填入内容 -->
    <MyDialog>
      <div>你确认要删除么</div>
    </MyDialog>

    <MyDialog>
      <p>你确认要退出么</p>
    </MyDialog>
    <!-- 默认插槽
    作用：让组件内部的一些结构支持自定义
    需求：要在页面中显示一个对话框，封装成一个组件
    问题：组件的内容部分，不希望写死，希望能使用的时候自定义，怎么办？
    插槽基本语法：
    1.组件内需要定制的结构部分，改用<slot></slot>
    2.使用组件时，<MyDialog></MyDialog>标签内部，传入结构替换slot -->
  </div>
</template>

<script>
import MyDialog from './components/MyDialog.vue'
export default {
  data () {
    return {

    }
  },
  components: {
    MyDialog
  }
}
</script>

<style>
body {
  background-color: #b3b3b3;
}
</style>